<template>
	<view>
		<view class="header">
			<text @click="back">返回</text>
			<input class="search" @click="change" type="text" placeholder="" placeholder-style="color:#D6D3CF" v-model="inputContent"/>
			<text @click="searchBtn">搜索</text>
		</view>
		<view class="section" :style="{height:screenHeight+'rpx'}">
			<view class="information" :data-notice="v.notice_id" v-for="(v,i) in box" @click="noticeSkip(v.notice_id)">
				<!-- <image :src="src"></image> -->
				<view class="contents">
					<text class="tit">{{v.resultContent}}</text>
					<!-- <view class="time"> -->
						<text class="time">{{v.resultTime}}</text>
						<!-- <text>10:00</text> -->
					<!-- </view> -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import http from '../../utils/http.js'
	import {useStore} from 'vuex'
	import {reactive,toRefs,onMounted} from 'vue'
	export default {
		setup(){
			const store=useStore();
			let data=reactive({
				inputContent:store.state.lijuhua.inputContent,
				// src:'',
				// resultContent:[],
				// resultTime:[],
				box:[],
				screenHeight:'',
				back(){
					uni.navigateTo({
						url:'../search/search'
					})
				},
				change(){
					uni.navigateTo({
						url:'../search/search'
					})
				},
				searchBtn(){
					uni.showModal({
						title:'提示',
						content:'您已经位于搜索结果页面中啦！',
						success:function(res){
							if(res.confirm){
								uni.hideLoading();
							}
						}
					})
				},
				getData(){
					console.log(data.inputContent)
					http({
						url:'/System/result/get',
						data:{
							title:data.inputContent
						}
					}).then((res)=>{
						// if(data.inputContent==''){
						// 	data.box=''
						// }else{
							// data.src='../../static/wode-04.png'
							res.data.data.forEach((v, i) => {
							  v.resultContent=v.notice_title;
							  v.resultTime=v.notice_time;
								data.box.push(v);
							});
						// }
					})
				},
				noticeSkip(v){
					// console.log(v)
					store.commit('dongji/setID',v),
					uni.navigateTo({
						url:'../announcement_details/announcement_details'
					})
					// console.log(v.target.dataset.notice_id)
				},
			})
			
			onMounted(()=>{
				data.getData();
				// console.log(uni.getSystemInfoSync().screenHeight)
				// data.screenHeight=uni.getSystemInfoSync().screenHeight+uni.getSystemInfoSync().windowHeight
			})
			
			return {...toRefs(data)}
		}
		
	}
</script>

<style scoped lang="scss">
	// page{
	// 	background-color: rgb(242,242,242) !important;
	// }
	.header {
		width: 710rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20rpx 20rpx 10rpx 20rpx;
		
		text {
			color: #3F96F1;
		}
		
		input {
			width: 460rpx;
			height: 50rpx;
			font-size: 28rpx;
			color: #8C8C8C;
			border-radius: 50rpx;
			border: 1px solid #E7E7E7;
			padding: 10rpx 30rpx;
			
		}
	}
	.section {
		// height: 100%;
		padding: 20rpx;
		background-color: #F2F2F2;
		
		.information {
			margin: 20rpx 0;
			border-radius: 20rpx;
			padding: 30rpx;
			background-color: #fff;
			display: flex;
			justify-content: space-between;
			// image {
			// 	width: 200rpx;
			// 	height: 150rpx;
			// }
			.contents {
				flex: 1;
				display: flex;
				font-size: 30rpx;
				flex-direction: column; 
				// justify-content: space-between;
				align-content: space-between;
				
				.time {
					color: #929292;
					font-size: 24rpx;
					margin-top: 16rpx;
					// display: flex;
					// justify-content: flex-start;
					
					// text {
					// 	flex: 1;
					// }
				}
			}
			
		}
		
	}
</style>
